<template>
  <div class="market_main">
    <tab-modal></tab-modal>
    <position v-if='marketCoupon.length>0' :positionTitleState="positionState" :info="marketCouponInfo"></position>
    <marketGoodCoupon :marketCoupon='marketCoupon' :findAllState='findAllState' :positionState="positionState"
                      :title1="title1" :title2="title2" @choTypeClick='choTypeClick'></marketGoodCoupon>
    <position :info="info" v-if="couponList.length"></position>
    <template v-for="(item,index) in couponList">
      <card :coupon-info="item">
        <div class="div_space" v-if="(index+1) != couponList.length"></div>
      </card>
    </template>
    <footer-view></footer-view>
  </div>
</template>

<script>
  import TabModal from './tab.vue'
  import marketGoodCoupon from './marketGoodCoupon.vue'
  import getDate4 from 'src/service/getData4'
  import {Storage} from 'src/utils/storage.js'
  import {Toast} from 'mint-ui'

  export default {
    name: "market",
    data: () => ({
      marketCoupon: [],
      title1: '',
      title2: '',
      positionState: true,
      findAllState: false,
      couponList: [],
      info: {title: "附近优惠", cue: "静静的待在你身边，等你", bColor: true},
      marketCouponInfo: {},
    }),
    async created() {
      this.$store.commit('changeState', true)
      let result = await getDate4.getMarketCoupon({
        data: {
          cityName: Storage.get('city', true),
          position: Storage.get('sit', true)
        }
      });
      this.couponList = result.content.couponList;
      //商券好券
      this.marketGoodCoupon()
      //解决ios返回出现空白问题
      setTimeout(function () {
        window.scrollTo(0, 1);
        window.scrollTo(0, 0);
      }, 100);
    },
    mounted() {
      this.$nextTick(async () => {

      })
    },
    methods: {
      choTypeClick() {

      },
      marketGoodCoupon() {
        getDate4.marketGoodCouponPos({
          data: {
            cityName: Storage.get('city', true),
            position: Storage.get('sit', true)
          }
        }).then(res => {
          if (res.respCode !== '00') {
            Toast({
              message: res.errorInfo,
              duration: 1000
            });
          } else {
            if (res.content.couponList) {
              this.positionState = true
              this.marketCouponInfo = {title: "商圈好券", cue: "海量好券，优惠“享”不停"}
              this.marketCoupon = res.content.couponList
              if (res.content.couponList.length > 4) {
                this.findAllState = true
              }
            } else {
              this.positionState = false
              this.marketCouponInfo = {title: "好券速递", cue: "不一定是最好的，但一定最优惠"}
              getDate4.marketGoodCoupon({}).then((rep) => {
                if (rep.respCode !== '00') {
                  Toast({
                    message: rep.errorInfo,
                    duration: 1000
                  });
                } else {
                  this.marketCoupon = []
                  this.marketCoupon = rep.content
                  if (rep.content.length > 4) {
                    this.findAllState = true
                  }
                }
              })
            }
          }
        })
      },
    },
    components: {
      TabModal,
      marketGoodCoupon,
      card: () => import('src/componentes/local/coupon-card/main-index.vue'),
      position: () => import('src/componentes/local/position.vue')
    }
  }
</script>

<style scoped="">
  .market_main {
    background-color: #ffffff;
    padding: 0;
  }
</style>